<!doctype html>
<html lang="zh-CN">
<head>
    <meta charset="utf-8">
    <meta name="renderer" content="webkit">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <title>写文章 - 502工作室管理系统</title>
    <link rel="stylesheet" type="text/css" href="css/bootstrap.min.css">
    <link rel="stylesheet" type="text/css" href="css/style.css">
    <link rel="stylesheet" type="text/css" href="css/font-awesome.min.css">
    <link rel="apple-touch-icon-precomposed" href="images/icon/icon.png">
    <link rel="shortcut icon" href="images/icon/favicon.ico">
    <script src="js/jquery-2.1.4.min.js"></script>
    <!--[if gte IE 9]>
    <script src="js/jquery-1.11.1.min.js" type="text/javascript"></script>
    <script src="js/html5shiv.min.js" type="text/javascript"></script>
    <script src="js/respond.min.js" type="text/javascript"></script>
    <script src="js/selectivizr-min.js" type="text/javascript"></script>
    <![endif]-->
    <!--[if lt IE 9]>
    <script>window.location.href = 'upgrade-browser.html';</script>
    <![endif]-->
</head>

<body class="user-select">
<section class="container-fluid">
    <header>
        <nav class="navbar navbar-default navbar-fixed-top">
            <div class="container-fluid">
                <div class="navbar-header">
                    <button type="button" class="navbar-toggle collapsed" data-toggle="collapse"
                            data-target="#bs-example-navbar-collapse-1" aria-expanded="false"><span
                            class="sr-only">切换导航</span> <span class="icon-bar"></span> <span class="icon-bar"></span>
                        <span class="icon-bar"></span></button>
                    <a class="navbar-brand" href="#">502</a></div>
                <div class="collapse navbar-collapse" id="bs-example-navbar-collapse-1">
                    <ul class="nav navbar-nav navbar-right">
                        <li><a href="#">消息 <span class="badge">1</span></a></li>
                        <li class="dropdown"><a class="dropdown-toggle" data-toggle="dropdown" role="button"
                                                aria-haspopup="true" aria-expanded="false">admin <span
                                class="caret"></span></a>
                            <ul class="dropdown-menu dropdown-menu-left">
                                <li><a title="查看或修改个人信息" data-toggle="modal" data-target="#seeUserInfo">个人信息</a></li>
                                <li><a title="查看您的登录记录" data-toggle="modal" data-target="#seeUserLoginlog">登录记录</a></li>
                            </ul>
                        </li>
                        <li><a href="/geekdaily/logout" onClick="if(!confirm('是否确认退出？'))return false;">退出登录</a></li>
                        <li><a data-toggle="modal" data-target="#WeChat">小程序</a></li>
                    </ul>
                    <form action="#" method="post" class="navbar-form navbar-right" role="search">
                        <div class="input-group">
                            <input type="text" class="form-control" autocomplete="off" placeholder="键入关键字搜索"
                                   maxlength="15">
                            <span class="input-group-btn">
              <button class="btn btn-default" type="button">搜索</button>
              </span></div>
                    </form>
                </div>
            </div>
        </nav>
    </header>
    <div class="row">
        <aside class="col-sm-3 col-md-2 col-lg-2 sidebar">
            <ul class="nav nav-sidebar">
                <li><a href="/geekdaily/index">报告</a></li>
            </ul>
            <ul class="nav nav-sidebar">
                <li class="active"><a href="/geekdaily/webArticle">文章</a></li>
                <li><a data-toggle="tooltip" data-placement="top" title="暂未开放该功能">公告</a></li>
                <li><a data-toggle="tooltip" data-placement="top" title="暂未开放该功能">评论</a></li>
                <li><a data-toggle="tooltip" data-placement="top" title="网站暂无留言功能">留言</a></li>
            </ul>
            <ul class="nav nav-sidebar">
                <li><a data-toggle="tooltip" data-placement="top" title="暂未开放该功能">栏目</a></li>
                <li><a data-toggle="tooltip" data-placement="top" title="暂未开放该功能">其他</a>
                <!--<li><a class="dropdown-toggle" id="otherMenu" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">其他</a>-->
                    <ul class="dropdown-menu" aria-labelledby="otherMenu">
                        <li><a href="flink.html">友情链接</a></li>
                        <li><a href="loginlog.html">访问记录</a></li>
                    </ul>
                </li>
            </ul>
            <ul class="nav nav-sidebar">
                <li><a data-toggle="tooltip" data-placement="top" title="暂未开放该功能">用户</a>
                <!--<li><a class="dropdown-toggle" id="userMenu" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">用户</a>-->
                    <ul class="dropdown-menu" aria-labelledby="userMenu">
                        <li><a href="#">管理用户组</a></li>
                        <li><a href="manage-user.html">管理用户</a></li>
                        <li role="separator" class="divider"></li>
                        <li><a href="loginlog.html">管理登录日志</a></li>
                    </ul>
                </li>
                <li><a data-toggle="tooltip" data-placement="top" title="暂未开放该功能">设置</a>
                <!--<li><a class="dropdown-toggle" id="settingMenu" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">设置</a>-->
                    <ul class="dropdown-menu" aria-labelledby="settingMenu">
                        <li><a href="setting.html">基本设置</a></li>
                        <li><a href="readset.html">用户设置</a></li>
                        <li role="separator" class="divider"></li>
                        <li><a href="#">安全配置</a></li>
                        <li role="separator" class="divider"></li>
                        <li class="disabled"><a>扩展菜单</a></li>
                    </ul>
                </li>
            </ul>
        </aside>
        <div class="col-sm-9 col-sm-offset-3 col-md-10 col-lg-10 col-md-offset-2 main" id="main">
            <div class="row">
                <form method="post" class="add-article-form" accept-charset="UTF-8">
                    <div class="col-md-9">
                        <h1 class="page-header">撰写新文章</h1>
                        <div class="form-group">
                            <label for="title" class="sr-only">标题</label>
                            <input type="text" id="title" name="title" class="form-control" placeholder="在此处输入标题"
                                   required autofocus autocomplete="off">
                        </div>
                        <div class="add-article-box">
                            <h2 class="add-article-box-title"><span>描述</span></h2>
                            <div class="add-article-box-content">
                                <textarea style="height: 120px" class="form-control" id="des" name="des" autocomplete="off"></textarea>
                                <!--<span class="prompt-text">描述是可选的手工创建的内容总结，并可以在网页描述中使用</span>-->
                            </div>
                        </div>
                        <div class="add-article-box">
                            <h2 class="add-article-box-title"><span>分类</span></h2>
                            <!--<div class="add-article-box-content">-->
                                <!--<input type="text" class="form-control" placeholder="请输入分类" id="category" name="category"-->
                                       <!--value="Android" required autocomplete="off" disabled="disabled">-->
                                <!--<span class="prompt-text">如Android、Java等。</span>-->
                            <!--</div>-->
                            <div class="add-article-box-content">
                                <input id="r_category1" type="radio" value="Android" name="category" checked="checked">Android</input>
                                <input id="r_category2" type="radio" value="iOS" name="category">iOS</input>
                                <input id="r_category3" type="radio" value="前端" name="category">前端</input>
                                <!--<input id="r_category4" type="radio" value="其他" name="category">其他</input>-->
                            </div>
                        </div>
                        <div class="add-article-box">
                            <h2 class="add-article-box-title"><span>子分类</span></h2>
                            <div class="add-article-box-content">
                                <input id="r_child_category0" type="radio" value="0" name="child_category" checked="checked">开源库</input>
                                <input id="r_child_category1" type="radio" value="1" name="child_category">资讯</input>
                                <input id="r_child_category2" type="radio" value="2" name="child_category">教程</input>
                                <input id="r_child_category3" type="radio" value="3" name="child_category">书籍</input>
                                <input id="r_child_category4" type="radio" value="4" name="child_category">工具</input>
                                <input id="r_child_category5" type="radio" value="5" name="child_category">APP</input>
                                <input id="r_child_category6" type="radio" value="6" name="child_category">活动</input>
                                <input id="r_child_category7" type="radio" value="7" name="child_category">招聘</input>
                                <input id="r_child_category8" type="radio" value="8" name="child_category">其他</input>
                            </div>
                        </div>
                        <div class="add-article-box">
                            <h2 class="add-article-box-title"><span>适合等级</span></h2>
                            <div class="add-article-box-content">
                                <input id="r1" type="radio" value="0" name="rank" checked="checked">所有人</input>
                                <input id="r2" type="radio" value="1" name="rank">初学</input>
                                <input id="r3" type="radio" value="2" name="rank">进阶</input>
                            </div>
                        </div>
                        <div>
                            <input type="hidden" id="contributor_id" name="contributor_id" placeholder="如：3"/>
                        </div>
                        <div class="add-article-box">
                            <h2 class="add-article-box-title"><span>文章链接</span></h2>
                            <div class="add-article-box-content">
                                <input type="text" class="form-control" placeholder="请输入文章链接" id="link" name="link"
                                       required autocomplete="off" onchange="isValidURL(this.value)"/>
                                <!--<span class="prompt-text">文章链接可选择网页链接。</span>-->
                            </div>
                        </div>

                        <div class="add-article-box">
                            <h2 class="add-article-box-title"><span>标题图片</span></h2>
                            <div class="add-article-box-content">
                                <!--<input type="file" class="form-control" placeholder="点击按钮选择图片" id="article_img" accept="image/*"-->
                                <!--name="article_img" autocomplete="off">-->
                                <input type="text" class="form-control" placeholder="请输入文章图片链接" id="img_url" name="img_url"
                                       required autocomplete="off" onchange="isValidURL(this.value)">
                                <h2 class="add-article-box-title"><span>或者</span></h2>
                                <input type="file" placeholder="点击按钮选择图片" id="upload_img" name="upload_img" accept="image/*"/>
                                <input type="button" class="form-control" value="点击上传" onclick="uploadImg()"/>
                            </div>
                        </div>

                        <!--<div class="add-article-box" style="display: none">-->
                            <!--<h2 class="add-article-box-title"><span>MD文本</span></h2>-->
                            <!--<div class="add-article-box-content">-->
                                <!--<textarea style="height: 200px" class="form-control" id="md_content" name="md_content"-->
                                          <!--required autocomplete="off"></textarea>-->
                                <!--<span class="prompt-text">MD文本是md风格的排版规则，请先把文章内容转成MD风格的文本</span>-->
                            <!--</div>-->
                        <!--</div>-->
                    </div>
                    <div class="col-md-3">
                        <h1 class="page-header">操作</h1>
                        <!--<div class="add-article-box">-->
                            <!--<h2 class="add-article-box-title"><span>标题图片</span></h2>-->
                            <!--<div class="add-article-box-content">-->
                                <!--&lt;!&ndash;<input type="file" class="form-control" placeholder="点击按钮选择图片" id="article_img" accept="image/*"&ndash;&gt;-->
                                       <!--&lt;!&ndash;name="article_img" autocomplete="off">&ndash;&gt;-->
                                <!--<input type="text" class="form-control" placeholder="请输入文章图片链接" id="img_url" name="img_url"-->
                                       <!--required autocomplete="off" onchange="isValidURL(this.value)">-->
                                <!--<h2 class="add-article-box-title"><span>或者</span></h2>-->
                                <!--<input type="file" placeholder="点击按钮选择图片" id="upload_img" name="upload_img" accept="image/*"/>-->
                                <!--<input type="button" class="form-control" value="点击上传" onclick="uploadImg()"/>-->
                            <!--</div>-->
                        <!--</div>-->
                        <div class="add-article-box">
                            <h2 class="add-article-box-title"><span>发布</span></h2>
                            <div class="add-article-box-content">
                                <p><label>状态：</label><span class="article-status-display">未发布</span></p>
                                <p><label>公开度：</label><input type="radio" name="visibility" value="0" checked/>公开 <input
                                        type="radio" name="visibility" value="1"/>加密</p>
                                <p><label>发布于：</label><span class="article-time-display"><input style="border: none;"
                                                                                                type="datetime"
                                                                                                name="time"
                                                                                                value="2016-01-09 17:29:37"/></span>
                                </p>
                            </div>
                            <div class="add-article-box-footer">
                                <button class="btn btn-primary" type="button" name="submit" onclick="uploadArticle()">发布</button>
                            </div>
                        </div>
                    </div>
                </form>
            </div>
        </div>
    </div>
</section>
<!--个人信息模态框-->
<div class="modal fade" id="seeUserInfo" tabindex="-1" role="dialog" aria-labelledby="myModalLabel">
    <div class="modal-dialog" role="document">
        <form action="" method="post">
            <div class="modal-content">
                <div class="modal-header">
                    <button type="button" class="close" data-dismiss="modal" aria-label="Close"><span
                            aria-hidden="true">&times;</span></button>
                    <h4 class="modal-title">个人信息</h4>
                </div>
                <div class="modal-body">
                    <table class="table" style="margin-bottom:0px;">
                        <thead>
                        <tr></tr>
                        </thead>
                        <tbody>
                        <tr>
                            <td wdith="20%">姓名:</td>
                            <td width="80%"><input type="text" value="王雨" class="form-control" name="truename"
                                                   maxlength="10" autocomplete="off"/></td>
                        </tr>
                        <tr>
                            <td wdith="20%">用户名:</td>
                            <td width="80%"><input type="text" value="admin" class="form-control" name="username"
                                                   maxlength="10" autocomplete="off"/></td>
                        </tr>
                        <tr>
                            <td wdith="20%">电话:</td>
                            <td width="80%"><input type="text" value="18538078281" class="form-control" name="usertel"
                                                   maxlength="13" autocomplete="off"/></td>
                        </tr>
                        <tr>
                            <td wdith="20%">旧密码:</td>
                            <td width="80%"><input type="password" class="form-control" name="old_password"
                                                   maxlength="18" autocomplete="off"/></td>
                        </tr>
                        <tr>
                            <td wdith="20%">新密码:</td>
                            <td width="80%"><input type="password" class="form-control" name="password" maxlength="18"
                                                   autocomplete="off"/></td>
                        </tr>
                        <tr>
                            <td wdith="20%">确认密码:</td>
                            <td width="80%"><input type="password" class="form-control" name="new_password"
                                                   maxlength="18" autocomplete="off"/></td>
                        </tr>
                        </tbody>
                        <tfoot>
                        <tr></tr>
                        </tfoot>
                    </table>
                </div>
                <div class="modal-footer">
                    <button type="button" class="btn btn-default" data-dismiss="modal">取消</button>
                    <button type="submit" class="btn btn-primary">提交</button>
                </div>
            </div>
        </form>
    </div>
</div>
<!--个人登录记录模态框-->
<div class="modal fade" id="seeUserLoginlog" tabindex="-1" role="dialog" aria-labelledby="myModalLabel">
    <div class="modal-dialog" role="document">
        <div class="modal-content">
            <div class="modal-header">
                <button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">&times;</span>
                </button>
                <h4 class="modal-title">登录记录</h4>
            </div>
            <div class="modal-body">
                <table class="table" style="margin-bottom:0px;">
                    <thead>
                    <tr>
                        <th>登录IP</th>
                        <th>登录时间</th>
                        <th>状态</th>
                    </tr>
                    </thead>
                    <tbody>
                    <tr>
                        <td>::1:55570</td>
                        <td>2016-01-08 15:50:28</td>
                        <td>成功</td>
                    </tr>
                    <tr>
                        <td>::1:64377</td>
                        <td>2016-01-08 10:27:44</td>
                        <td>成功</td>
                    </tr>
                    <tr>
                        <td>::1:64027</td>
                        <td>2016-01-08 10:19:25</td>
                        <td>成功</td>
                    </tr>
                    <tr>
                        <td>::1:57081</td>
                        <td>2016-01-06 10:35:12</td>
                        <td>成功</td>
                    </tr>
                    </tbody>
                </table>
            </div>
            <div class="modal-footer">
                <button type="button" class="btn btn-default" data-dismiss="modal">朕已阅</button>
            </div>
        </div>
    </div>
</div>
<!--微信二维码模态框-->
<div class="modal fade user-select" id="WeChat" tabindex="-1" role="dialog" aria-labelledby="WeChatModalLabel">
    <div class="modal-dialog" role="document" style="margin-top:120px;max-width:280px;">
        <div class="modal-content">
            <div class="modal-header">
                <button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">&times;</span>
                </button>
                <h4 class="modal-title" id="WeChatModalLabel" style="cursor:default;">微信扫一扫</h4>
            </div>
            <div class="modal-body" style="text-align:center"><img src="images/weixin.jpg" alt=""
                                                                   style="cursor:pointer"/></div>
        </div>
    </div>
</div>
<!--提示模态框-->
<div class="modal fade user-select" id="areDeveloping" tabindex="-1" role="dialog"
     aria-labelledby="areDevelopingModalLabel">
    <div class="modal-dialog" role="document">
        <div class="modal-content">
            <div class="modal-header">
                <button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">&times;</span>
                </button>
                <h4 class="modal-title" id="areDevelopingModalLabel" style="cursor:default;">该功能正在日以继夜的开发中…</h4>
            </div>
            <div class="modal-body"><img src="images/baoman/baoman_01.gif" alt="深思熟虑"/>
                <p style="padding:15px 15px 15px 100px; position:absolute; top:15px; cursor:default;">
                    很抱歉，程序猿正在日以继夜的开发此功能，本程序将会在以后的版本中持续完善！</p>
            </div>
            <div class="modal-footer">
                <button type="button" class="btn btn-primary" data-dismiss="modal">朕已阅</button>
            </div>
        </div>
    </div>
</div>
<!--右键菜单列表-->
<div id="rightClickMenu">
    <ul class="list-group rightClickMenuList">
        <li class="list-group-item disabled">欢迎访问异清轩博客</li>
        <li class="list-group-item"><span>IP：</span>172.16.10.129</li>
        <li class="list-group-item"><span>地址：</span>河南省郑州市</li>
        <li class="list-group-item"><span>系统：</span>Windows10</li>
        <li class="list-group-item"><span>浏览器：</span>Chrome47</li>
    </ul>
</div>
<script src="js/bootstrap.min.js"></script>
<script src="js/admin-scripts.js"></script>
<!--<script src="lib/ueditor/ueditor.config.js"></script>-->
<!--<script src="lib/ueditor/ueditor.all.min.js"> </script>-->
<!--<script src="lib/ueditor/lang/zh-cn/zh-cn.js"></script>-->
<script id="uploadEditor" type="text/plain" style="display:none;"></script>
// <script type = "text/javascript">
// var editor = UE.getEditor('article-content');
//自动刷新
// window.onresize = function () {
//     window.location.reload();
// }

window.onload = function () {
    var contributor_id = document.getElementById("contributor_id");
    //从cookie中取出 contributor_id的值
    var userId = getCookie("geek_userId");
    contributor_id.value = parseInt(userId);
};

//上传图片
function uploadImg() {
    var file = $("#upload_img")[0].files[0];
    if(file && file.size > 0){
        if(file.size > 1024 * 1024 * 10) {
            alert('图片大小不能超过 10MB!');
            return false;
        }
        var formdata = new FormData();
        formdata.append('articleImg',file);
        $.ajax({
            type: "POST",
            url: "/geekdaily/uploadArticleImg",
            data: formdata,
            processData : false,
            contentType : false,
            async:false,
            cache: false, //不缓存此页面
            success: function(data){
                //前端调用成功后，可以处理后端传回的json格式数据。
                if(data.code == 0){
                    var img_url = document.getElementById("img_url");
                    if(data.data["articleImg"] != null){
                        img_url.value = data.data["articleImg"];
                    }
                    window.alert("上传图片成功!");
                }else {
                    window.alert("上传出错了!"+data.toString());
                }
            },
            error:function (data) {
                window.alert("上传出错了!");
            }
        })
    }
}

//上传文章
function uploadArticle() {
    var title = document.getElementById("title").value;
    var des = document.getElementById("des").value;
    var userId = getCookie("geek_userId");
    var contributorId = parseInt(userId);
    var category = $("input[name='category']:checked").val();
    var childCategory = $("input[name='child_category']:checked").val();
    var rank = $("input[name='rank']:checked").val();
    var link = document.getElementById("link").value;
    var imgUrl = document.getElementById("img_url").value;
    $.ajax({
        type: "POST",
        url: "/geekdaily/uploadArticle",
        data: {
            "title":title,
            "des":des,
            "contributorId":contributorId,
            "category":category,
            "childCategory":childCategory,
            "rank":rank,
            "link":link,
            "imgUrl":imgUrl
        },
        cache: false, //不缓存此页面
        success: function(data){
            //前端调用成功后，可以处理后端传回的json格式数据。
            if(data.code == 0){
                // console.log("成功："+data.msg);
                //想跳转到某个html页面怎么写
                window.location.href = "/geekdaily/webArticle";
            }else {
                window.alert(data.msg);
            }
        },
        error:function (data) {
            window.alert("出错了!");
        }
    })
}

// var _uploadEditor;
// $(function () {
//     //重新实例化一个编辑器，防止在上面的editor编辑器中显示上传的图片或者文件
//     _uploadEditor = UE.getEditor('uploadEditor');
//     _uploadEditor.ready(function () {
//         //设置编辑器不可用
//         //_uploadEditor.setDisabled();
//         //隐藏编辑器，因为不会用到这个编辑器实例，所以要隐藏
//         _uploadEditor.hide();
//         //侦听图片上传
//         _uploadEditor.addListener('beforeInsertImage', function (t, arg) {
//             //将地址赋值给相应的input,只去第一张图片的路径
//             $("#article_img").attr("value", arg[0].src);
//             //图片预览
//             //$("#imgPreview").attr("src", arg[0].src);
//         })
//         //侦听文件上传，取上传文件列表中第一个上传的文件的路径
//         _uploadEditor.addListener('afterUpfile', function (t, arg) {
//             $("#fileUpload").attr("value", _uploadEditor.options.filePath + arg[0].url);
//         })
//     });
// });
// //弹出图片上传的对话框
// $('#upImage').click(function () {
//     var myImage = _uploadEditor.getDialog("insertimage");
//     myImage.open();
// });
//
// //弹出文件上传的对话框
// function upFiles() {
//     var myFiles = _uploadEditor.getDialog("attachment");
//     myFiles.open();
// }
//js验证一个URl字符串是否有效
function isValidURL(url){
    // var urlRegExp=/^((https|http|ftp|rtsp|mms)?:\/\/)+[A-Za-z0-9]+\.[A-Za-z0-9]+[\/=\?%\-&_~`@[\]\':+!]*([^<>\"\"])*$/;
    // if(urlRegExp.test(url)){
    //     return true;
    // }else{
    //     alert("文章链接格式非法，请重新填写!");
    //     document.getElementById("link").value ="";
    //     return false;
    // }
    return true;
}
function setCookie(name,value)
{
    var Days = 30;
    var exp = new Date();
    exp.setTime(exp.getTime() + Days*24*60*60*1000);
    document.cookie = name + "="+ escape (value) + ";expires=" + exp.toGMTString();
}
//获取cookie的值
function getCookie(name) {
    var arr, reg = new RegExp("(^| )" + name + "=([^;]*)(;|$)");
    if (arr = document.cookie.match(reg))
        return unescape(arr[2]);
    else
        return null;
}
</script>
</body>
</html>
